<template>
  <div>
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :sm="12">
            <a-form-item  :label="$t('m.system.user.entity.realname')">
              <a-input placeholder="" v-model="queryParam.username"></a-input>
            </a-form-item>
          </a-col>
          <a-col :sm="12">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">{{ $t('m.common.button.query') }}</a-button>
              <a-button type="default" @click="searchReset" icon="reload" style="margin-left: 8px">{{ $t('m.common.button.reset') }}</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button @click="handleAddUserRole" type="primary" icon="plus">{{ $t('m.system.user.other.add_user') }}</a-button>
      <a-button @click="batchDel" type="default"  icon="delete" v-test>{{ $t('m.common.button.delete') }}</a-button>
    </div>
    <!-- table区域-begin -->
    <a-table
      ref="table"
      bordered
      size="middle"
      rowKey="id"
      :columns="columns"
      :dataSource="dataSource"
      :pagination="ipagination"
      :loading="loading"
      :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
      @change="handleTableChange"
    >
      <template slot="action" slot-scope="text, record">
        <a @click="handleEdit(record)">{{ $t('m.common.button.update') }}</a>
        <a-divider type="vertical"/>
        <a-popconfirm placement="left" :title="$t('m.common.tip.delete_confirm')" @confirm="() => handleDelete(record.id)">
          <a>{{ $t('m.common.button.delete') }}</a>
        </a-popconfirm>
      </template>
    </a-table>
    <!-- 表单区域 -->
    <user-modal ref="modalForm" @ok="modalFormOk" :portal="portal"></user-modal>
    <select-user-modal ref="selectUserModal" @selectFinished="selectOK" :portal="portal"></select-user-modal>
  </div>
</template>
<script>

  import { YcListMixin } from '@/mixins/YcListMixin'
  import { deleteAction, postAction,getAction } from '@/api/manage'
  import SelectUserModal from './modules/SelectUserModal'
  import UserModal from './modules/UserModal'
  import YchConstant from "@/api/YchConstant";

  export default {
    name: 'RoleUserRight',
    mixins: [YcListMixin],
    props: {
      role: Object,
      portal: {
        type: String,
        default: '0'
      }
    },
    components: {
      SelectUserModal,
      UserModal,
    },
    data () {
      return {
        queryParam: {
          roleId: this.role.id
        },
        columns: [{
          title: this.$t('m.system.user.entity.username'),
          align: 'center',
          dataIndex: 'username',
          width: 120
        },
          {
            title: this.$t('m.system.user.entity.realname'),
            align: 'center',
            dataIndex: 'realname'
          },
          /*{
            title: '状态',
            align: 'center',
            width: 80,
            dataIndex: 'status_dictText'
          },*/
          {
            title: this.$t('m.common.label.operate'),
            dataIndex: 'action',
            scopedSlots: { customRender: 'action' },
            align: 'center',
            width: 130
          }],
        url: {
          list: this.portal == '1' ? YchConstant.PREFIX_SYSTEM + '/user/userRoleListNoAdmin' : YchConstant.PREFIX_SYSTEM + '/user/userRoleList',
          addUserRole: YchConstant.PREFIX_SYSTEM + '/user/addSysUserRole',
          delete: YchConstant.PREFIX_SYSTEM + '/user/deleteUserRole',
          deleteBatch: YchConstant.PREFIX_SYSTEM + '/user/deleteUserRoleBatch',
        }
      }
    },
    methods: {
      loadData(arg) {
        if(!this.url.list){
          this.messageUtil.error("请设置url.list属性!")
          return
        }
        //加载数据 若传入参数1则加载第一页的内容
        if (arg === 1) {
          this.ipagination.current = 1;
        }
        var params = this.getQueryParams();//查询条件
        if(!params.roleId || params.roleId==''){
          return;
        }
        this.loading = true;
        getAction(this.url.list, params).then((res) => {
          if (res.success) {
            this.dataSource = res.result.records;
            this.ipagination.total = res.result.total;
          }
          if(res.code===510){
            this.messageUtil.warning(res.message)
          }
          this.loading = false;
        })
      },
      handleAdd: function () {
        this.$refs.modalForm.roleDisabled = true
        this.$refs.modalForm.selectedRole = [this.role.id]
        this.$refs.modalForm.add()
        this.$refs.modalForm.title = this.$t('m.common.button.add')
      },
      handleDelete: function (id) {
        deleteAction(this.url.delete, { roleId: this.role.id, userId: id }).then((res) => {
          if (res.success) {
            this.messageUtil.success(res.message)
            this.loadData()
          } else {
            this.messageUtil.warning(res.message)
          }
        })
      },
      batchDel: function () {
        if (this.selectedRowKeys.length <= 0) {
          this.messageUtil.warning(this.$t('m.common.tip.select_one_warn'))
          return
        } else {
          const ids = this.selectedRowKeys.join(',')
          const that = this;
          this.$confirm({
            title: this.$t('m.common.title.delete'),
            content: this.$t('m.common.tip.delete_confirm'),
            onOk: function () {
              deleteAction(that.url.deleteBatch, { roleId: that.role.id, userIds: ids }).then((res) => {
                if (res.success) {
                  that.messageUtil.success(res.message)
                  that.loadData()
                  that.onClearSelected()
                } else {
                  that.messageUtil.warning(res.message)
                }
              })
            }
          })
        }
      },
      selectOK (data) {
        const params = {
          roleId: this.role.id,
          userIdList: data
        }
        postAction(this.url.addUserRole, params).then((res) => {
          if (res.success) {
            this.loadData()
            this.messageUtil.success(res.message)
          } else {
            this.messageUtil.warning(res.message)
          }
        })
      },
      handleAddUserRole () {
        if(this.role && this.role.id){
          this.$refs.selectUserModal.visible = true
        }else{
          this.messageUtil.warning(this.$t('m.system.permission.other.select_role'))
        }
      },
      searchReset () {
        this.queryParam = {
          roleId: this.role.id
        }
        this.loadData(1)
      },
      hideUserList () {
        this.$emit('hideUserList')
      }
    },
    watch: {
      role: {
        handler () {
          this.searchReset()
        },
        immediate: false
      }
    }
  }
</script>
<style lang="less" scoped>

</style>
